
import PageView from '../../../static/sys/js/view/PageView'
import Area from '../json/Area.json'

var Index = PageView.extend({
  type: "Index",

  initialize: function () {
    window.yyesn.client.setHeader({title:"测试"});
    this.$el.on("click", ".search-header", this.takeModal.bind(this));
    this.$el.on("click", ".backdrop", this.hideModal.bind(this));
    this.modal = {};

  },
  didRender: function () {
    this.headerEl = this.el.querySelector(".search-header");
    this.backdrop = this.$el.find(".backdrop");

    this.modal["area"] = this.el.querySelector(".top-down-modal.area");
    this.modal["type"] = this.el.querySelector(".top-down-modal.type");
    this.modal["order"] = this.el.querySelector(".top-down-modal.order");
    this.modal["filter"] = this.el.querySelector(".top-down-modal.filter");

  },
  takeModal: function (e) {
    var target = e.target;
    for (; target && target !== this.headerEl; target = target.parentNode) {
      if (target.classList.contains("item")) {
        var target_name = target.classList[0];
        this.currentHeaderEl && this.currentHeaderEl.classList.remove("active");
        this.currentHeaderEl = target;
        this.currentHeaderEl.classList.add("active");

        // var preModal = this.currentModal;
        if (this.currentKey && this.currentKey == target_name) return;
        this.currentModal && this.currentModal.classList.add("hide");
        this.currentModal && this.currentModal.classList.remove("active");


        this.currentModal = this.modal[target_name];
        this.currentKey = target_name;

        this.currentModal.classList.remove("hide");
        setTimeout(function () {
          this.currentModal.classList.add("active");
        }.bind(this), 12)

        //点击过快 有问题 不适用
        // if (this.currentModal) {
        //   var i = 1;
        //   this.currentModal.addEventListener("webkitTransitionEnd", function (e) {
        //      if (i > 1) return;
        //       preModal && preModal.classList.remove("hide");
        //      i++;
        //    }.bind(this))
        // }


      }
    }

  },
  showModal: function () {
    this.modal.classList.add("active");
    this.backdrop.addClass("active");
  },
  hideModal: function () {
    this.modal.classList.remove("active");
    this.backdrop.removeClass("active");
  },
  takeTypeModal: function () {

  },
  takeOrderModal: function () {

  },
  takeFilterModal: function () {

  },
  takeSearch: function () {

  },

  onResume: function () {

  }



})





export default  Index
